<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link th:href="@{/css/style.css}" rel="stylesheet" type="text/css" />
<script type="text/javascript" th:src="@{/js/jquery.js}"></script>
</head>

<body>
<div class="place"> <span>位置：</span>
  <ul class="placeul">
    <li>系统管理</li>
    <li>部门管理</li>
    <li>添加</li>
  </ul>
</div>
<div class="formbody">
  <div class="formtitle"><span>部门信息</span></div>
  <form id="addDept" th:action="@{/sys/dept/addDept}" method="post">
  <input type="hidden" name="deptState" value="1"/>
  <ul class="forminfo">
    <li>
      <label>部门名称</label>
      <input id="deptName" name="deptName" type="text" class="dfinput" />
      <i>必填，不能超过30个字符</i>
    </li>
    <li>
      <label>所属区域</label>
      <select id="pId" name="pId" onchange="getCities(this.value)" class="dfselect">
          <option value="">请选择</option>
          <option th:each="p:${session.plist}" th:value="${p.id}" th:text="${p.pName}">北京</option>
      </select>
      省
      <select id="cId" name="cId" class="dfselect">
          <option value="">请选择</option>
      </select>
      市
      <i>必选</i>
    </li>
    <li>
      <label>&nbsp;</label>
      <input onclick="addDept()" type="button" class="btn" value="确认保存"/>
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      <input name="" type="button" class="btn" value="返回"  onclick="window.history.go(-1);"/>
    </li>
  </ul>
  </form>
</div>

<script>
  $(function () {
    ajaxCid($("select[name=pId]").val());

    $("select[name=pId]").change(function () {
      ajaxCid($(this).val());
    });
  });
  //域内容发生变化的事件
  function ajaxCid(pid) {
    $.ajax({
      url: "/erp/market/customer/ajaxCityPid",
      data: {"pid": pid},
      dataType: "JSON",
      success: function (data) {
        var city = JSON.parse(data);
        var op = "<option value='0'>请选择城市</option>";
        $.each(city, function (i, e) {
          if (e.id == $("input[name=cid]").val()) {
            op += "<option value='" + e.id + "' selected>" + e.cname + "</option>";
          } else {
            op += "<option value='" + e.id + "'>" + e.cname + "</option>";
          }
        });
        $("select[name=cId]").html("");
        $("select[name=cId]").append(op);

      }, error: function () {
        console.log("错误");
      }
    });
  }
</script>

<!--注册表单验证-->
<script>
  $(function () {
    $("#deptName").blur(function () {
      ckdeptName();
    });
    $("#pId").blur(function () {
      ckpId();
    });
    $("#cId").blur(function () {
      ckcId();
    });
  });
  function ckdeptName() {
    if($("#deptName").val()==""){
      return false;
    }else{
      return true;
    }
  }
  function ckpId() {
    if($("#pId").val()=="0"){
      return false;
    }else{
      return true;
    }
  }
  function ckcId() {
    if($("#cId").val()=="0"){
      return false;
    }else{
      return true;
    }
  }
  function addDept() {
    if(ckdeptName()&&ckpId()&&ckcId()){
      $("#addDept").submit();
    }else{
      confirm("添加部门失败！");
    }
  }
</script>
</body>
</html>
